<template>
	<view class="padding-top" :class="solidStyle">
		<template v-if="sign === 'collect'">
			<view class="flex align-center">
				<view class="cu-avatar round margin-right-sm" :style="'background-image:url(' + item.avatar + ');'"></view>
				<view class="flex flex-sub flex-direction" @click="handleHref(item)">
					<view class="text-gray">{{ item.sTitle }}</view>
					<view class="text-gray text-sm"></view>
				</view>
				<view class="action text-gray round" v-if="showActions">
					<text class="cuIcon-right"></text>
				</view>
			</view>
		</template>
		<template v-else-if="sign === 'sandbox'">
			<view class="flex align-center">
				<view class="cu-avatar round margin-right-sm" :style="'background-image:url(' + item.avatar + ');'"></view>
				<view class="flex flex-sub flex-direction" @click="handleHref(item.nIndex)">
					<view class="text-bold">{{ item.sTitle }}</view>
					<view class="text-gray text-sm">{{ item.sDescribe }}</view>
				</view>
				<view class="action text-lg text-white bg-primary cu-avatar round" v-if="showActions" @click="handleShare()">
					<text class="cuIcon-share"></text>
				</view>
			</view>
		</template>
		<template v-else>
			<view @click="handleHref(item.nIndex)">
				<view class="text-bold text-primary">{{ item.sTitle }}</view>
				<view class="margin-top-sm" v-if="itemType != 3">{{ item.subtitle }}</view>
				<view class="margin-top-sm flex align-center text-gray">
					<view class="cu-avatar round margin-right-sm" :style="'background-image:url(' + item.avatar + ');'"></view>
					<view>
						<text>nUid {{ item.nUid }}</text>
					</view>
				</view>
				<view class="flex justify-between padding-tb-sm text-gray text-xs">
					<!-- time -->
					<view>
						<text class="cuIcon-time margin-right-xs"></text>
						<text>{{ item.createtime | friendlyDate }}</text>
					</view>
					<view class="action" v-if="showActions">
						<text class="cuIcon-community margin-left-sm" @click="handleFavorite()"></text>
					</view>
				</view>
			</view>
		</template>
	</view>
</template>

<script>
	import {
		formatDate,
		friendlyDate
	} from '@/common/util.js';

	export default {
		name: "app-list-item",
		data() {
			return {
				showModal: false
			};
		},
		filters: {
			formatDate: (value) => {
				return formatDate(value, 'YYYY-MM-DD');
			},
			friendlyDate: (value) => {
				return friendlyDate(value, true);
			}
		},
		props: {
			itemType: {
				type: Number,
				default: 0
			},
			sign: {
				type: String,
				default: ''
			},
			item: {
				type: Object,
				default: {}
			},
			showActions: {
				type: Boolean,
				default: true
			},
			solidStyle: {
				type: String,
				default: ''
			}
		},
		created() {
			// code
		},
		methods: {
			handleFavorite() {
				this.$emit('handleFavorite', this.item);
			},
			handleShare() {
				this.$emit('handleShare', this.item);
			},
			handleHref(nIndex) {
				this.$emit('handleHref', nIndex);
			}
		}
	}
</script>

<style>

</style>
